<template>
  <div style="display: inline-block" v-if="task && workflow">
    <template v-if="checkRole(['admin']) && !task.isLeaf">
      <el-button :size="size" :type="type" icon="el-icon-search" @click="handleInitialTask(task)" v-if="taskStep == 1"
        >分包</el-button
      >

      <el-button
        :size="size"
        :type="type"
        icon="el-icon-search"
        @click="handleResultSummarize(task)"
        v-hasPermi="['mark:qatask:deliver']"
        v-if="taskStep > 5"
        >汇总</el-button
      >
    </template>

    <template v-if="task.isLeaf">
      <el-button :size="size" :type="type" icon="el-icon-monitor" @click="openClient" v-if="taskStep > 1"
        >打开软件</el-button
      >
    </template>

    <template v-if="workflow.status == 0 && task.isLeaf">
      <template v-if="checkPermi(['task:workflow:assign'])">
        <el-button :size="size" :type="type" icon="el-icon-edit" @click="handleAssign(workflow)">指派</el-button>
        <user-select-dialog :visible.sync="userSelectVisible" @change="handleAssignTask" />
      </template>

      <el-button
        :size="size"
        :type="type"
        icon="el-icon-edit"
        @click="handlePick(workflow)"
        v-hasPermi="['task:workflow:pick']"
        >拾取</el-button
      >
    </template>

    <template v-if="workflow.status == 1">
      <template v-if="workflow.doUser == name">
        <el-button
          v-if="task.status > 10"
          :size="size"
          :type="type"
          icon="el-icon-search"
          @click="handleAutoCheck(task)"
          >自动质检</el-button
        >
        <el-button :size="size" :type="type" icon="el-icon-check" @click="handleFinish(workflow)">{{
          taskStep > 1 ? '通过' : '完成'
        }}</el-button>
        <el-button v-if="taskStep > 1" :size="size" :type="type" icon="el-icon-close" @click="handleReject(workflow)"
          >不通过</el-button
        >
      </template>
      <el-button
        :size="size"
        :type="type"
        icon="el-icon-d-arrow-left"
        @click="handleRevoke(workflow)"
        v-hasPermi="['task:workflow:revoke']"
        >撤回</el-button
      >
    </template>

    <slot> </slot>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import { checkRole, checkPermi } from '@/utils/permission'
import { updateQaTaskStatus, summarize, batchSummarize, taskAutoCheck } from '@/api/mark/qaTaskV1'
import { assignTask, pickTask, finishTask, rejectTask, revokeTask } from '@/api/task/workflow'
import { getStep } from '@/utils/workflow'
import UserSelectDialog from '@/components/UserSelectDialog'

export default {
  name: 'TaskOperationButtons',
  components: { UserSelectDialog },

  props: {
    task: { type: Object, required: true },
    size: { type: String, default: '' },
    type: { type: String, default: 'text' },

    taskInitFn: { type: Function },
    taskCheckFn: { type: Function },
  },
  data() {
    return {
      userSelectVisible: false,
    }
  },

  computed: {
    ...mapGetters(['name']),

    workflow() {
      return this.task?.workflow || {}
    },

    taskStep() {
      return getStep(this.workflow.taskStatus)
    },

    taskRepeat() {
      return 0
    },
  },

  methods: {
    checkRole,
    checkPermi,

    openClient() {
      // TODO:
      window.location.href = 'labelking://{token:token,pkg_name:pkg_name,user_name:user_name,user_type:user_type}'
    },

    handleAutoCheck(row) {
      const data = { taskId: row.taskId }
      taskAutoCheck(data)
        .then((response) => {
          if (response.code === 200) {
            this.msgSuccess(response.msg)
          } else {
            this.msgError(response.msg)
          }
        })
        .catch(console.error)
    },

    /** 新增抽检任务操作 */
    handleTaskCheck(row) {
      this?.taskCheckFn(row)
    },

    //  分包/初始化
    handleInitialTask(row) {
      this?.taskInitFn(row)
    },

    handleResultSummarize(row) {
      this.$confirm('是否汇总该任务下的三级目录的标注结果?', '提示', {
        confirmButtonText: '汇总',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(function () {
          return summarize(row.taskId)
        })
        .then((res) => {
          this.$emit('updated', res)
          this.msgSuccess('汇总成功，请在5分钟后刷新验收页面检查汇总结果。')
        })
        .catch(console.error)
    },

    /** 新的流程管理 */
    handleAssign(row) {
      this.currentTask = row
      this.userSelectVisible = true
    },

    handleAssignTask(field, user) {
      const task = { ...this.currentTask, doUser: user.userName }
      assignTask(task)
        .then((res) => {
          console.log(res)
          if (res.code === 200) {
            this.msgSuccess('指派成功')
            this.$emit('updated', res)
          } else {
            this.msgError(res.msg)
          }
        })
        .catch((err) => {
          console.log(err)
          this.msgError(err.msg)
        })
    },

    handlePick(workflow) {
      this.submitWorkflow(pickTask, workflow.id, '拾取成功!')
    },
    handleFinish(workflow) {
      this.submitWorkflow(finishTask, workflow.id, '更新成功!')
    },
    handleReject(workflow) {
      this.submitWorkflow(rejectTask, workflow.id, '更新成功!')
    },
    handleRevoke(workflow) {
      this.submitWorkflow(revokeTask, workflow.id, '撤回成功!')
    },

    submitWorkflow(func, data, msg) {
      func(data)
        .then((res) => {
          if (res.code === 200) {
            this.msgSuccess(msg)
            this.$emit('updated', res)
          } else {
            this.msgError(res.msg)
          }
        })
        .catch((err) => {
          this.msgError(err.msg)
        })
    },
  },
}
</script>
